<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>无线点餐平台</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="${pageContext.request.contextPath }/reception/detail/style/js/jquery.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/reception/detail/style/js/page_common.js"></script>
<link href="${pageContext.request.contextPath }/reception/detail/style/css/common_style_blue.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/reception/detail/style/css/index_1.css" />
	<link href="${pageContext.request.contextPath }/reception/detail/style/css/index.css" rel="stylesheet" type="text/css" />
</head>
<script type="text/javascript">
	function showPage(num){
		//1 修改隐藏域的值
		document.getElementById("pageNum").value = num;
		//2 提交表单
		document.forms[0].submit();
	}
</script>
<body style="text-align: center">
	<form action="${pageContext.request.contextPath }/foodtype/findAllFood.do" method="post">
		<input type="hidden" name="pageNum" id="pageNum" value="1" />
	</form>
	<div id="all">
		<div id="menu">
			<!-- 显示菜品的div -->
			<div id="top">
				<ul>
					<!-- 循环列出餐品 -->
					<c:forEach items="${findFoodtype.foods }" var="foods">	
						<li>
							<dl>
								<dt>
									<a href="${pageContext.request.contextPath }/food/findById.do?id=${foods.id}">
										<img width="214px" height="145px" src="${pageContext.request.contextPath }/reception/detail/style/images/baizhuoxia.jpg" />
									</a>
								</dt>
								<dd class="f1">
									<a href="${pageContext.request.contextPath }/food/findById.do?id=${foods.id}">${foods.foodname }</a>
								</dd>
								<dd class="f2">
									<a href="${pageContext.request.contextPath }/food/findById.do?id=${foods.id}">&yen;${foods.price }</a>
								</dd>
							</dl>
						</li>
					</c:forEach>
					<c:forEach items="${pageBean.data }" var="foods">	
						<li>
							<dl>
								<dt>
									<a href="${pageContext.request.contextPath }/food/findById.do?id=${foods.id}">
										<img width="214px" height="145px" src="${pageContext.request.contextPath }/reception/detail/style/images/baizhuoxia.jpg" />
									</a>
								</dt>
								<dd class="f1">
									<a href="${pageContext.request.contextPath }/food/findById.do?id=${foods.id}">${foods.foodname }</a>
								</dd>
								<dd class="f2">
									<a href="${pageContext.request.contextPath }/food/findById.do?id=${foods.id}">&yen;${foods.price }</a>
								</dd>
							</dl>
						</li>
					</c:forEach>
						
					
				</ul>
			</div>
			<!-- 底部分页导航条div -->
			<div id="foot">
				
					 
					
						<span
							style="float:left; line-height:53PX; margin-left:-50px; font-weight:bold; ">
							<span style="font-weight:bold"><a href="javascript:void(0)" onclick="showPage(${pageBean.pageNum - 1})" style=" text-decoration:none;color:#000000; font-weight:bold"style=" text-decoration:none;color:#000000; font-weight:bold">&lt;&lt;</a></span>
						</span>
					
				
				<div id="btn">
					<ul>
						<!-- 参看 百度, 谷歌是 左 5 右 4 -->
						<c:forEach begin="${pageBean.start }" end="${pageBean.end }" var="num">
							<li><a href="javascript:void(0)" onclick="showPage(${num})">${num}</a></li>
		        		</c:forEach>
					</ul>
				</div>
				
					
						<span style="float:right; line-height:53px; margin-right:10px;  ">
							<a href="javascript:void(0)"
							style=" text-decoration:none;color:#000000; font-weight:bold" onclick="showPage(${pageBean.pageNum + 1})">&gt;&gt;</a>
						</span>
					
					
				
			</div>
			
		</div>

		<!-- 右边菜系列表，菜品搜索框  -->
		<div id="dish_class">
			<div id="dish_top">
				<ul>
				<li class="dish_num"></li>
					<li>
						<a href="clientOrderList.jsp">
							<img src="${pageContext.request.contextPath }/reception/detail/style/images/call2.gif" />
						</a>
					</li>
				</ul>
			</div>

			<div id="dish_2">
				<ul>
					<c:forEach items="${foodtypes }" var="foodtypeList">
						<li>
							<a href="${pageContext.request.contextPath }/foodtype/findById.do?id=${foodtypeList.id}">${foodtypeList.typename}</a>
						</li>
					</c:forEach>
					</ul>
						
			</div>
			<div id="dish_3">
				<!-- 搜索菜品表单  -->
				<form action="${pageContext.request.contextPath }/foodtype/findAllFood.do" method="post">
					<table width="166px">
						<tr>
							<td>
								<input type="text" id="dish_name" placeholder="请输入搜索的菜名" name="foodname" class="select_value" /> 
								<input type="hidden" value="selectFood" name="method">
							</td>
						</tr>
						<tr>
							<td><input type="submit" id="sub" value="" /></td>
						</tr>
						<tr>
							<td>
								<a href="${pageContext.request.contextPath }/foodtype/findAllFood.do">
									<img src="${pageContext.request.contextPath }/reception/detail/style/images/look.gif" />
								</a>
								
								<a href="caidan.jsp">
							</td>
						</tr>
					</table>
				</form>
			</div>
		</div>
	</div>
</body>
</html>